﻿<div class="content-wrapper">
    <section class="content-header">
        <h1>
            巡检管理
            <small>巡检确认</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
            <li><a href="#">巡检管理</a></li>
            <li class="active">巡检确认</li>
        </ol>
    </section>
    <section class="content">
        <div class="row">
            <div class="col-xs-12">
                <div class="box">
                    <div class="box-body">
                        <div class="form-inline">
                            <label>站点</label>
                            <input type="text" v-model="search1" ref="search1" id="search1" class="form-control">
                            <label>设备名称</label>
                            <input type="text" v-model="search2" ref="search2" id="search2" class="form-control">
                        </div>
                        <div id="toolbar" class="btn-group">
                            <button id="btn_search" v-on:click="searchL" type="button" class="btn btn-default">
                                <span class="glyphicon glyphicon-search" aria-hidden="true"></span>查询
                            </button>
                        </div>
                        <table id="bootstraptable" class="table table-bordered text-nowrap table-hover"></table>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>
@section scripts{
    <script type="text/javascript">
        var app = new Vue({
            el: '#app',
            data: {
                search1: '@ViewBag.ClientName',
                search2: '@ViewBag.DeviceName',
                clientWidth: document.body.clientWidth,//获取设备屏幕的宽度
            },
            mounted: function () {
                var _self = this;
                _self.$nextTick(function () {
                    //显示active
                    _self.$refs.Inspection.parentNode.parentNode.classList.add("active");
                    _self.$refs.Inspection.classList.add("active");

                    setTimeout(function () {
                        _self.loadL();
                        setDataCardView("#bootstraptable");
                    }, 500);
                });
            },
            methods: {
                loadL: function () {
                    _self = this;
                    var obj = [{
                        checkbox: true,             //是否显示复选框
                        visible: true
                    }, {
                        field: 'InspectionId',
                        title: 'InspectionId',
                        visible: false
                    }, {
                        field: 'ClientName',
                        title: '站点',
                        align: 'center',
                        sortable: true
                    }, {
                        field: 'DeviceName',
                        align: 'center',
                        title: '设备名称'
                    }, {
                        field: 'Action',
                        title: '巡检确认',
                        align: 'center',
                        sortable: true,
                        formatter: function (value, row, index) {
                            return "<button class='btn btn-primary' onclick=\"ConfirmInspection(" + row.ClientId + "," + row.DeviceId + ",'" + row.ClientName + "','" + row.DeviceName + "')\">巡检确认</button>";
                        }
                    }];
                    yui.table("bootstraptable", "/Inspection/List", obj, "POST", "ClientId", false, false, "ClientName", "asc", false, true, true);
                },
                searchL: function () {
                    $("#bootstraptable").bootstrapTable('refresh');
                },
                editL: function (ClientId, DeviceId, ClientName, DeviceName) {
                    var width = 750;
                    if (this.clientWidth <= 767) {
                        width = this.clientWidth * 0.9;
                    }

                    yui.layershow("确认巡检", "/Inspection/Add?ClientId=" + ClientId + "&DeviceId=" + DeviceId+"&ClientName=" + ClientName + "&DeviceName=" + DeviceName, width, 700);

                }
            }
        });

        function ConfirmInspection(ClientId, DeviceId, ClientName, DeviceName) {

            app.editL(ClientId, DeviceId, replaceStr(ClientName), replaceStr(DeviceName));
        }
        function replaceStr(str) {
            str = str.replace(/:/g, "%3A");
            str = str.replace(/\//g, "%2F");
            str = str.replace(/\?/g, "%3F");
            str = str.replace(/=/g, "%3D");
            str = str.replace(/&/g, "%26");
            str = str.replace(/\+/g, "%2B");
            str = str.replace(/ /g, "%20");
            str = str.replace(/#/g, "%23");
            return str;
        }


    </script>
}